<template>
  <div class="flex text-blue-theme align-center">
    <svg
      t="1667281406134"
      class="icon"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="2618"
      width="30"
      height="30"
    >
      <path
        d="M343.207869 699.240918V127.24459a99.714098 99.714098 0 0 0-99.714099-99.714098h-2.014426a99.714098 99.714098 0 0 0-99.714098 99.714098v571.996328c-40.708197 30.636066-67.147541 79.200525-67.147541 134.060066 0 92.713967 75.154885 167.868852 167.868852 167.868852s167.868852-75.154885 167.868853-167.868852c0-54.859541-26.439344-103.440787-67.147541-134.060066z"
        fill="#FFFFFF"
        p-id="2619"
      ></path>
      <path
        d="M242.486557 1017.956721c-101.812459 0-184.655738-82.843279-184.655737-184.655737a182.977049 182.977049 0 0 1 67.147541-142.201705V127.24459a116.635279 116.635279 0 0 1 116.500983-116.500983h2.014426a116.635279 116.635279 0 0 1 116.500984 116.500983v563.854689c42.772984 35.269246 67.147541 86.637115 67.147541 142.201705 0 101.812459-82.843279 184.655738-184.655738 184.655737z m-1.007213-973.639344a83.011148 83.011148 0 0 0-82.927213 82.927213v571.996328c0 5.271082-2.467672 10.24-6.697967 13.412721-38.42518 28.923803-60.449574 72.888656-60.449574 120.664131 0 83.296525 67.785443 151.081967 151.081967 151.081968s151.081967-67.785443 151.081968-151.081968c0-47.758689-22.04118-91.740328-60.449574-120.664131a16.786885 16.786885 0 0 1-6.697967-13.412721V127.24459a83.011148 83.011148 0 0 0-82.927214-82.927213h-2.014426z"
        fill="#000000"
        p-id="2620"
      ></path>
      <path
        d="M276.060328 738.438295a100.670951 100.670951 0 0 1-33.573771 195.584 100.654164 100.654164 0 1 1-33.57377-195.584V127.916066a33.238033 33.238033 0 0 1 33.238033-33.238033h0.671475a33.238033 33.238033 0 0 1 33.238033 33.238033v610.522229z"
        fill="#FFFFFF"
        p-id="2621"
      ></path>
      <path
        d="M276.060328 738.438295V262.546885h-67.147541v475.89141a100.670951 100.670951 0 0 0 33.57377 195.584 100.654164 100.654164 0 1 0 33.573771-195.584z"
        fill="#ED1C24"
        p-id="2622"
      ></path>
      <path
        d="M863.601311 127.24459a99.714098 99.714098 0 0 0-99.714098-99.714098h-2.014426a99.714098 99.714098 0 0 0-99.714098 99.714098v571.996328c-40.708197 30.636066-67.147541 79.200525-67.147541 134.060066 0 92.713967 75.154885 167.868852 167.868852 167.868852s167.868852-75.154885 167.868852-167.868852c0-54.859541-26.439344-103.440787-67.147541-134.060066V127.24459z"
        fill="#FFFFFF"
        p-id="2623"
      ></path>
      <path
        d="M259.273443 396.841967h33.57377v33.573771h-33.57377z"
        fill="#000000"
        p-id="2624"
      ></path>
      <path
        d="M292.847213 727.224656V463.989508h-33.57377v274.432a16.786885 16.786885 0 0 0 11.180065 15.830033 84.035148 84.035148 0 0 1 55.967476 79.032656c0 46.281443-37.652984 83.934426-83.934427 83.934426s-83.934426-37.652984-83.934426-83.934426c0-35.420328 22.494426-67.181115 55.967476-79.032656a16.786885 16.786885 0 0 0 11.180065-15.830033V279.33377h33.573771v83.934427h33.57377V127.916066c0-27.580852-22.444066-50.024918-50.696393-50.024918a50.092066 50.092066 0 0 0-50.024918 50.024918v599.30859a117.692852 117.692852 0 0 0-67.147541 106.076328c0 64.797377 52.71082 117.508197 117.508196 117.508196s117.508197-52.71082 117.508197-117.508196a117.692852 117.692852 0 0 0-67.147541-106.076328zM242.822295 111.464918a16.451148 16.451148 0 0 1 16.451148 16.451148v117.843934h-33.573771V127.916066c0-9.081705 7.369443-16.451148 17.122623-16.451148zM393.568525 279.33377h67.147541v33.573771h-67.147541zM393.568525 346.481311h67.147541v33.573771h-67.147541zM393.568525 413.628852h67.147541v33.573771h-67.147541zM393.568525 480.776393h67.147541v33.573771h-67.147541zM393.568525 547.923934h67.147541v33.573771h-67.147541zM393.568525 615.071475h67.147541v33.573771h-67.147541zM846.814426 262.546885h33.573771v33.573771h-33.573771z"
        fill="#000000"
        p-id="2625"
      ></path>
      <path
        d="M762.88 1017.956721c-101.812459 0-184.655738-82.843279-184.655738-184.655737a182.977049 182.977049 0 0 1 67.147541-142.201705V127.24459a116.635279 116.635279 0 0 1 116.500984-116.500983h2.014426a116.635279 116.635279 0 0 1 116.500984 116.500983v101.728525h-33.573771V127.24459a83.011148 83.011148 0 0 0-82.927213-82.927213h-2.014426a83.011148 83.011148 0 0 0-82.927213 82.927213v571.996328c0 5.271082-2.467672 10.24-6.697967 13.412721-38.42518 28.923803-60.449574 72.888656-60.449574 120.664131 0 83.296525 67.785443 151.081967 151.081967 151.081968s151.081967-67.785443 151.081967-151.081968c0-47.758689-22.04118-91.740328-60.449574-120.664131a16.786885 16.786885 0 0 1-6.697967-13.412721V329.694426h33.573771v361.404853c42.772984 35.269246 67.147541 86.637115 67.147541 142.201705 0 101.812459-82.843279 184.655738-184.655738 184.655737z"
        fill="#000000"
        p-id="2626"
      ></path>
      <path
        d="M796.45377 738.438295V127.916066a33.238033 33.238033 0 0 0-33.238032-33.238033h-0.671476a33.238033 33.238033 0 0 0-33.238032 33.238033v610.522229a100.670951 100.670951 0 0 0 33.57377 195.584 100.654164 100.654164 0 1 0 33.57377-195.584z"
        fill="#FFFFFF"
        p-id="2627"
      ></path>
      <path
        d="M729.30623 447.202623h67.14754v33.57377h-67.14754z"
        fill="#000000"
        p-id="2628"
      ></path>
      <path
        d="M796.45377 738.438295V463.989508h-67.14754v274.448787a100.670951 100.670951 0 0 0 33.57377 195.584 100.654164 100.654164 0 1 0 33.57377-195.584z"
        fill="#3EBBDD"
        p-id="2629"
      ></path>
      <path
        d="M813.240656 727.224656V127.916066c0-27.580852-22.444066-50.024918-50.696394-50.024918a50.092066 50.092066 0 0 0-50.024918 50.024918v599.30859a117.692852 117.692852 0 0 0-67.147541 106.076328c0 64.797377 52.71082 117.508197 117.508197 117.508196s117.508197-52.71082 117.508197-117.508196a117.692852 117.692852 0 0 0-67.147541-106.076328zM763.215738 111.464918a16.451148 16.451148 0 0 1 16.451147 16.451148v319.286557h-33.57377V127.916066c0-9.081705 7.369443-16.451148 17.122623-16.451148z m-0.335738 805.770492c-46.281443 0-83.934426-37.652984-83.934426-83.934426 0-35.420328 22.494426-67.181115 55.967475-79.032656a16.786885 16.786885 0 0 0 11.180066-15.830033V480.776393h33.57377v257.661902a16.786885 16.786885 0 0 0 11.180066 15.830033 84.035148 84.035148 0 0 1 55.967475 79.032656c0 46.281443-37.652984 83.934426-83.934426 83.934426zM913.961967 547.923934h67.147541v33.573771h-67.147541zM913.961967 480.776393h67.147541v33.573771h-67.147541zM913.961967 615.071475h67.147541v33.573771h-67.147541z"
        fill="#000000"
        p-id="2630"
      ></path>
    </svg>
    <div class="ml10">温度：{{ degree }}℃</div>
  </div>
  <div class="flex text-blue-theme mtb10 align-center">
    <svg
      t="1667281605476"
      class="icon"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="3561"
      width="30"
      height="30"
    >
      <path
        d="M233.7792 626.8416a240.64 240.64 0 0 1 88.8832-74.0352V169.6256c0-60.3136 56.6784-109.4144 126.464-109.4144 69.888 0 126.5664 49.0496 126.5664 109.4144v383.1808a241.8176 241.8176 0 0 1 88.7808 74.0352c25.1904 34.816 38.5536 75.1104 38.5536 116.4288 0 58.624-26.4192 113.7664-74.3424 155.2384-47.9232 41.5232-111.7184 64.4096-179.5584 64.4096-67.7376 0-131.6352-22.8352-179.5072-64.4096-47.9232-41.4208-74.3936-96.5632-74.3936-155.2384a198.5024 198.5024 0 0 1 38.5536-116.4288zM449.2288 926.72c116.992 0 212.0192-82.2784 212.0192-183.5008 0-69.376-44.4928-132.096-116.0704-163.584l-11.3152-5.0176v-404.992c0-40.4992-37.888-73.2672-84.6336-73.2672S364.544 129.1776 364.544 169.6256v405.0432l-11.4176 5.0176c-71.5264 31.488-116.0704 94.208-116.0704 163.6352 0.1024 100.9664 95.1808 183.3984 212.1728 183.3984z m0 0"
        fill="#00A0E9"
        p-id="3562"
      ></path>
      <path
        d="M411.8528 647.7824V291.4816c0-17.8176 16.6912-32.3584 37.376-32.3584 20.5824 0 37.376 14.4384 37.376 32.3584v356.2496c43.6224 13.3632 74.7008 49.3056 74.7008 91.4432 0 53.504-50.1248 96.9728-112.0768 96.9728-61.8496 0-112.0768-43.3664-112.0768-96.9728-0.0512-42.2912 31.2832-78.1312 74.7008-91.392zM240.64 178.1248c0-20.3776-43.008-81.8176-43.008-81.8176s-43.008 61.5424-43.008 81.8176c0 20.3264 19.1488 36.7616 43.008 36.7616 23.8592 0.0512 43.008-16.4352 43.008-36.7616zM154.7264 502.9888c0-30.3104-64.2048-122.0608-64.2048-122.0608S26.4704 472.576 26.4704 502.9888c0 30.4128 28.7232 54.9376 64.2048 54.9376 35.328 0 64.0512-24.576 64.0512-54.9376z m718.6944 84.6336c68.6592 0 124.1088-47.616 124.1088-106.3424 0-58.7776-124.1088-236.2368-124.1088-236.2368S749.312 422.656 749.312 481.28c0 58.7264 55.552 106.3424 124.1088 106.3424z m0 0"
        fill="#00A0E9"
        p-id="3563"
      ></path>
    </svg>
    <div class="ml10">湿度：{{ humidity }}%</div>
  </div>
  <div class="flex text-blue-theme align-center">
    <svg
      t="1667282616601"
      class="icon"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="5286"
      width="30"
      height="30"
    >
      <path
        d="M512 0c282.76736 0 512 229.23264 512 512S794.76736 1024 512 1024 0 794.76736 0 512 229.23264 0 512 0zM173.28128 230.6048c-8.704 6.59456-11.6736 18.06336-7.70048 28.07808l45.99808 113.0496-45.99808 113.09056a24.43264 24.43264 0 0 0 7.70048 28.32384c4.48512 3.42016 9.95328 5.12 15.42144 5.12 4.97664 0 10.19904-1.45408 14.41792-4.62848l167.6288-117.47328h116.38784v219.79136h-49.74592V860.16h49.74592v-195.3792h49.72544V860.16h49.74592V615.95648h-49.74592V396.16512h174.08v36.63872c0 8.8064 4.97664 17.1008 12.94336 21.23776 3.72736 1.96608 7.94624 3.1744 11.93984 3.1744 4.46464 0 9.19552-1.2288 13.16864-3.66592l99.47136-61.0304c7.20896-4.4032 11.69408-12.47232 11.69408-20.76672s-4.48512-16.36352-11.6736-20.76672l-99.49184-61.0304a25.6 25.6 0 0 0-25.10848-0.73728 24.7808 24.7808 0 0 0-12.94336 21.48352v36.63872H370.74944l-167.6288-117.47328a24.9856 24.9856 0 0 0-29.83936 0.73728z"
        fill="#53E17D"
        p-id="5287"
      ></path>
    </svg>
    <div class="ml10">
      {{ WIND_DIR[wind_direction] }}: {{ WIND_POW[wind_power] }}
    </div>
  </div>
</template>

<script>
import props from "../forms/props";
import { toRefs } from "vue";
export default {
  mixins: [props],
  setup({ options }) {
    const WIND_DIR = {
      0: "无持续风向",
      1: "东北风",
      2: "东风",
      3: "东南风",
      4: "南风",
      5: "西南风",
      6: "西风",
      7: "西北风",
      8: "北风",
      9: "旋转风",
    };
    const WIND_POW = {
      0: "",
      1: "一级",
      2: "二级",
      3: "三级",
      4: "四级",
      5: "五级",
      6: "六级",
      7: "七级",
      8: "八级",
      9: "九级",
      10: "十级",
      11: "十一级",
      12: "十二级",
    };

    return {
      WIND_DIR,
      WIND_POW,
      ...toRefs(options),
    };
  },
};
</script>

<style lang="scss" scoped></style>
